/* 这是引入了一些字体 */
/*@import url('https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900');*/

/** {*/
/*    margin: 0;*/
/*    padding: 0;*/
/*    box-sizing: border-box;*/
/*    font-family: 'Poppins', sans-serif;*/
/*}*/

/*body {*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*    min-height: 100vh;*/
/*    background: #333;*/
/*}*/

/*.user_card {*/
/*    position: relative;*/
/*    width: 350px;*/
/*    height: 190px;*/
/*    background: var(--card_bg);*/
/*    transition: 0.5s;*/
/*}*/

/*.user_card:hover {*/
/*    height: 450px;*/
/*}*/

/*.user_card .lines {*/
/*    position: absolute;*/
/*    inset: 0;*/
/*    background: var(--card_bg);*/
/*    overflow: hidden;*/
/*}*/

/*.user_card .lines::before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    top: 50%;*/
/*    left: 50%;*/
/*    width: 600px;*/
/*    height: 120px;*/
/*    background: linear-gradient(transparent, #45f3ff, #45f3ff, #45f3ff, transparent);*/
/*    animation: animate 4s linear infinite;*/
/*}*/

/*@keyframes animate {*/
/*    0% {*/
/*        transform: translate(-50%, -50%) rotate(0deg);*/
/*    }*/
/*    100% {*/
/*        transform: translate(-50%, -50%) rotate(360deg);*/
/*    }*/
/*}*/

/*.user_card .lines::after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    !* https://developer.mozilla.org/en-US/docs/Web/CSS/inset *!*/
/*    inset: 3px;*/
/*    background: var(--card_bg);*/
/*}*/

/*.user_card:hover .imgBx {*/
/*    width: 250px;*/
/*    height: 250px;*/
/*}*/

/*.user_card .imgBx {*/
/*    !* border-radius: 50%; *!*/
/*    position: absolute;*/
/*    top: -50px;*/
/*    left: 50%;*/
/*    transform: translateX(-50%);*/
/*    width: 150px;*/
/*    height: 150px;*/
/*    background: var(--card_bg);*/
/*    transition: 0.5s;*/
/*    z-index: 10;*/
/*    overflow: hidden;*/
/*}*/

/*.user_card .imgBx::before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    top: 50%;*/
/*    left: 50%;*/
/*    width: 500px;*/
/*    height: 150px;*/
/*    transform: translate(-50%, -50%);*/
/*    background: linear-gradient(transparent, #ff3c7b, #ff3c7b, #ff3c7b, transparent);*/
/*    animation: animate2 6s linear infinite;*/
/*}*/

/*@keyframes animate2 {*/
/*    0% {*/
/*        transform: translate(-50%, -50%) rotate(360deg);*/
/*    }*/
/*    100% {*/
/*        transform: translate(-50%, -50%) rotate(0deg);*/
/*    }*/
/*}*/

/*.user_card .imgBx::after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    inset: 3px;*/
/*    background: var(--card_bg);*/
/*}*/

/*.user_card .imgBx img {*/
/*    position: absolute;*/
/*    top: 10px;*/
/*    left: 10px;*/
/*    z-index: 1;*/
/*    width: calc(100% - 20px);*/
/*    height: calc(100% - 20px);*/
/*    !* filter: grayscale(1); *!*/
/*}*/

/*.user_card .content {*/
/*    position: absolute;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: flex-end;*/
/*    overflow: hidden;*/
/*}*/

/*.user_card .content .details {*/
/*    padding: 40px;*/
/*    text-align: center;*/
/*    width: 100%;*/
/*    transition: 0.5s;*/
/*    transform: translateY(150px);*/
/*}*/

/*.user_card:hover .content .details {*/
/*    transform: translateY(0px);*/
/*}*/

/*.user_card .content .details h2 {*/
/*    font-size: 1.25em;*/
/*    font-weight: 600;*/
/*    color: var(--font_1);*/
/*    line-height: 1.2em;*/
/*}*/

/*.user_card .content .details h2 span {*/
/*    font-size: 0.75em;*/
/*    font-weight: 500;*/
/*    opacity: 0.5;*/
/*    color: var(--font_2);*/
/*}*/

/*.user_card .content .details .data {*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    margin: 20px 0;*/
/*}*/

/*.user_card .content .details .data h3 {*/
/*    font-size: 1em;*/
/*    color: var(--font_1);*/
/*    line-height: 1.2em;*/
/*    font-weight: 600;*/
/*}*/

/*.user_card .content .details .data h3 span {*/
/*    font-size: 0.85em;*/
/*    font-weight: 400;*/
/*    opacity: 0.5;*/
/*    color: var(--font_2);*/
/*}*/

/*.user_card .content .details .actionBtn {*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*}*/

/*.user_card .content .details .actionBtn button {*/
/*    padding: 10px 30px;*/
/*    border-radius: 5px;*/
/*    border: none;*/
/*    outline: none;*/
/*    font-size: 1em;*/
/*    font-weight: 500;*/
/*    background: #45f3ff;*/
/*    color: var(--font_2);*/
/*    cursor: pointer;*/
/*    opacity: 0.9;*/
/*}*/

/*.user_card .content .details .actionBtn button:nth-child(2) {*/
/*    !* border: 1px solid #999; *!*/
/*    !* color: #999; *!*/
/*    background: #ee4848;*/
/*}*/

/*.user_card .content .details .actionBtn button:hover {*/
/*    opacity: 1;*/
/*}*/